<template>
  <div class="app-container">
    <el-row class="title animation">
      <span>基于<a class="gratitude title" href="https://gitee.com/y_project/RuoYi-Vue">RuoYi-Vue</a>框架</span>
    </el-row>
    <el-row class="title animation">
      <span>HIS东软云医院管理系统</span>
    </el-row>
    <el-row class="animation">
      <el-link class="gratitude" href="http://120.79.202.7/">
        特别鸣谢全部开源，支持快速开发的若依平台
      </el-link>
    </el-row>
  </div>
</template>

<script>
export default {
  name: "Index",
  data() {
    return {
      // 版本号
      version: "3.8.6"
    };
  },
  methods: {
    goTarget(href) {
      window.open(href, "_blank");
    }
  }
};
</script>

<style scoped>

.app-container {
  background-size: cover;
  background-image: url("../assets/images/R-C.jpg");
  background-blend-mode: color;
  opacity: 0.8;
  height: 100%;
}

.el-row:nth-of-type(1) {
  margin-top: 30px;
}

.el-row:nth-of-type(2) {
  margin-top: 10px;
}

.el-row:nth-of-type(3) {
  margin-top: 350px;
}

.animation {
  display: flex;
  justify-content: flex-start;
  animation: moving-in-out 2s ease-in-out;
}

.title {
  color: snow;
  font-family: 华文彩云;
  font-size: xx-large;
}

.gratitude {
  color: black;
  font-family: 华文行楷;
  font-size: xx-large;
  transition: color ease-in-out 1s;
}

.gratitude:hover {
  color: #00afff;
  transition: color ease-in-out 1s;
}

@keyframes moving-in-out {
  0% {
    left: -400px
  }

  100% {
    left: 0;
  }
}
</style>

